<!DOCTYPE html>

<html xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	xmlns:c="http://java.sun.com/jsp/jstl/core">


<h:head>

	<style type="text/css">
.ui-layout,.ui-layout-doc,.ui-layout-unit,.ui-layout-wrap,.ui-layout-bd,.ui-layout-hd
	{
	border: none;
}

body {
	margin: 3% 7% 3% 7%;
}

.ui-widget,.ui-widget .ui-widget {
	font-size: 95%;
}

.ui-panelmenu-header,.ui-menuitem-text {
	font-size: 10pt
}

.companyHeaderGrid tr,.companyHeaderGrid td {
	border: none;
}
</style>

</h:head>

<h:body>

	<ui:composition>


		<h:form id="escursioni_filter_form">


			<p:panelGrid columns="4" style="min-width: 100%"
				styleClass="companyHeaderGrid">
				<f:facet name="header">  Filtra Trasporti  </f:facet>

				<h:outputLabel for="city" value="Citta: " />
				<p:autoComplete id="city" value="#{escursioneBean.datiFiltro.citta}"
					label="Citta Partenza" completeMethod="#{cittaBean.complete}"
					var="c" itemLabel="#{c.name}" minQueryLength="3" itemValue="#{c}"
					forceSelection="true" converter="cittaConverter">

					<p:ajax event="itemSelect" update="city" />

				</p:autoComplete>


				<f:facet name="footer">
					<p:commandButton value="Filtra" icon="ui-icon-check"
						style="margin:0" update=":tab_view_id:escursione_list_form"
						actionListener="#{escursioneBean.filtraEscursioni}" />
				</f:facet>

			</p:panelGrid>
		</h:form>


		<h:form id="escursione_list_form">
			<!-- START - Tabella dei escursioni -->

			<p:dataTable value="#{escursioneBean.listaEscursioniFiltrate}"
				var="escursione" id="escursioni_table" rowSelectMode="single"
				rows="20000" selectionMode="single" paginator="false"
				selection="#{escursioneBean.escursioneSelezionata}"
				rowKey="#{escursione.descrizione}" scrollable="true"
				liveScroll="true"  scrollHeight="240">

				<!-- Definisco cosa deve fare con la selezione -->
				<p:ajax event="rowSelect"
					oncomplete="window.location.href='escursione_detail.xhtml'"/>



				<f:facet name="header"> Escursioni disponibili </f:facet>

				<p:column>
					<f:facet name="header"> Citta </f:facet>
									#{escursione.citta.name}
								</p:column>

				<p:column>
					<f:facet name="header"> Descrizione </f:facet>
									#{escursione.descrizione}
								</p:column>

				<p:column>
					<f:facet name="header"> Prezzo </f:facet>
									#{escursione.prezzo}
								</p:column>

			</p:dataTable>

			<!-- END - Tabella dei escursioni -->
		</h:form>
	</ui:composition>


</h:body>
</html>